<!DOCTYPE html>
<html lang=zh-CN>
<head>
    <title id="live_title">知食分子推荐</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="author" content="monicaqin">
    <meta name="format-detection" content="telephone=no"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" type="text/css" href="css/root.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/account/user.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/order/order.css?var=10"/>

    <script type="text/javascript" src="js/base/jquery-3.1.1.min.js?ver=2.0.4" charset="utf-8"></script>
    <script type="text/javascript" src="js/base/underscore-min.js"></script>
    <script type="text/javascript" src="js/base/moment.min.js"></script>
    <script src="js/base/api.js"></script>
    <script src="js/base/magiclamp.js"></script>
    <script src="js/base/base.js"></script>
    <script src="js/base/vue-filter.js"></script>
    <script src="js/base/vue.js"></script>
    <script src="js/base/swipe.min.js"></script>
    <script src="js/base/phone.js"></script>
    <script src="js/iconfont.js"></script>
    <script src="js/home_pro_goods.js"></script>

    <!--    <script src="js/lib/clipboard.min.js"></script>-->


    <!-- Core CSS file -->
    <link rel="stylesheet" href="photoswipe/photoswipe.css">

    <!-- Skin CSS file (styling of UI - buttons, caption, etc.)
         In the folder of skin CSS file there are also:
         - .png and .svg icons sprite,
         - preloader.gif (for browsers that do not support CSS animations) -->
    <link rel="stylesheet" href="photoswipe/default-skin/default-skin.css">

    <!-- Core JS file -->
    <script src="photoswipe/photoswipe.min.js"></script>

    <!-- UI JS file -->
    <script src="photoswipe/photoswipe-ui-default.min.js"></script>
    <script>

    </script>

</head>
<body>

<div id="play_background" style="position:absolute;top: 0px;bottom: 0px;left: 0;right: 0;">

    <div id="play_page">
        <header>
            <a @click="page_back" v-if="baseConfig.is_phone" class="h-left back-btn"><i
                    class="iconfont icon-fanhui"></i></a>
            <h1 class="h-title">知食分子推荐 </h1>
        </header>
        <!--商品-->
        <div class="page-container">
            <div class="line" v-for="homecomment in goods_list" style="padding: 0.2rem;">
                <div style="display: flex;width: 100%;flex-direction: row;"
                     @click="open_pro_user_goods(homecomment.id, homecomment.comment.user_id)">
                    <img :src="baseConfig.qn_host +homecomment.small_image__fileurl+'?imageView2/1/w/50/h/50'"
                         style="flex: 0 0 4rem;width: 4rem;height: 4rem;margin: 0.2rem;">
                    <div style="flex: 1 0 ;display: flex; flex-direction: column">
                        <div style="margin: 0.2rem; width: 100%;font-size: 1.5rem;">
                            {{homecomment.name}}
                        </div>
                        <div style="margin: 0.2rem;color: red;">
                            {{price_filter(homecomment.price)}}
                        </div>
                    </div>
                </div>
                <div style="padding-left: 5rem; width:100%; display: flex;flex-direction: column;" v-if="homecomment.comment.id">
                    <div style="display: flex;width: 100%;flex-direction: row;"
                         @click="open_pro_user(homecomment.comment.user_id)">

                        <img :src="homecomment.comment.user__icon_url"
                             style="flex: 0 0 3rem;width: 3rem;height: 3rem;margin: 0.1rem;">
                        <div style="flex: 1 0 ;display: flex; flex-direction: column;margin: 0.1rem;">
                            <div style="margin: 0.2rem;color: #0da4ff;">
                                {{homecomment.comment.user__realname}}
                            </div>

                        </div>
                    </div>
                    <div style=" width: 100%;font-size: 1.5rem;">
                        {{homecomment.comment.content}}
                    </div>
                    <div  v-if="homecomment.comment.file_type==1">
                        <div style="display: flex;flex-direction: row;flex-wrap: wrap;">

                            <img style="margin: 0.1rem;"
                                 :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/105/h/105'" width="32%"
                                 @click="show_big_pengyou_img(homecomment.comment, img.fileurl)"
                                 v-if="homecomment.comment.files_json.length>1"
                                 v-for="img in homecomment.comment.files_json">

                            <img style="margin: 0.1rem;"
                                 :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/330/h/330'" width="65%"
                                 @click="show_big_pengyou_img(homecomment.comment, img.fileurl)"
                                 v-if="homecomment.comment.files_json.length==1"
                                 v-for="img in homecomment.comment.files_json">

                        </div>
                    </div>
                    <div class="my-order-title pengyou_video"
                         v-if="homecomment.comment.file_type==2&&homecomment.comment.video_obj.id">
                        <video :src="baseConfig.qn_host + homecomment.comment.video_obj.fileurl"
                               :id="'video'+homecomment.id"
                               style="width:100%;"
                               x-webkit-airplay="true" preload="auto"
                               x5-video-player-type="h5" webkit-playsinline="true"
                               controls
                               playsinline
                               :poster="get_fengmian(homecomment.comment.video_img__fileurl, homecomment.small_image__fileurl)"
                        >

                        </video>
                    </div>
                    <div style="color: #cccccc;">
                        {{homecomment.comment.create_time}}
                    </div>
                </div>
            </div>
            <div class="more" @click="query_goods_comment_by_pro_list_by_one" v-if="good_page_index!=good_page_count">
                加载更多……
            </div>
        </div>

        <div id="all_pengyou_images" v-if="show_pengyou_dongtai_images">
            <div class="pswp" id="all_pengyou_pswp" tabindex="-1" role="dialog" aria-hidden="true">

                <!-- Background of PhotoSwipe.
                     It's a separate element as animating opacity is faster than rgba(). -->
                <div class="pswp__bg"></div>

                <!-- Slides wrapper with overflow:hidden. -->
                <div class="pswp__scroll-wrap">

                    <!-- Container that holds slides.
                        PhotoSwipe keeps only 3 of them in the DOM to save memory.
                        Don't modify these 3 pswp__item elements, data is added later on. -->
                    <div class="pswp__container">
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                    </div>

                    <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
                    <div class="pswp__ui pswp__ui--hidden">

                        <div class="pswp__top-bar">

                            <!--  Controls are self-explanatory. Order can be changed. -->

                            <div class="pswp__counter"></div>

                            <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>


                            <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                            <!-- element will get class pswp__preloader--active when preloader is running -->
                            <div class="pswp__preloader">
                                <div class="pswp__preloader__icn">
                                    <div class="pswp__preloader__cut">
                                        <div class="pswp__preloader__donut"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                            <div class="pswp__share-tooltip"></div>
                        </div>

                        <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
                        </button>

                        <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
                        </button>

                        <div class="pswp__caption">
                            <div class="pswp__caption__center"></div>
                        </div>

                    </div>

                </div>

            </div>
        </div>
    </div>
</div>

</body>
</html>